import React, { ReactNode } from 'react'
import { Card } from 'antd'
import { Item, ItemPanel } from 'gg-editor'
import styles from './index.less'

const FlowItemPanel = () => (
  <ItemPanel className={styles.itemPanel}>
    <Card bordered={false}>
      <Item
        type='node'
        size='72*72'
        shape='flow-circle'
        model={{
          color: '#FA8C16',
          label: 'Start'
        }}
        src=''
      />
      <Item
        type='node'
        size='80*48'
        shape='flow-rect'
        model={{
          color: '#1890FF',
          label: 'Normal'
        }}
        src=''
      />
      <Item
        type='node'
        size='80*72'
        shape='flow-rhombus'
        model={{
          color: '#13C2C2',
          label: 'Decision'
        }}
        src=''
      />
      <Item
        type='node'
        size='80*48'
        shape='flow-capsule'
        model={{
          color: '#722ED1',
          label: 'Model'
        }}
        src=''
      />
    </Card>
  </ItemPanel>
)

export default FlowItemPanel
